<template>
	<view class="enroll">
		<view class="banner">
			<image src="@/static/top_bg.png" mode="widthFix"></image>
		</view>
		<view class="tiaojian">
			<view class="card-cell">
				<image src="/static/enroll/success.png" mode=""></image>
				<view class="desc">
					具有本市户籍，或持有本市核发的浙江省居住
					证，或在本市已办理居住登记，或在本市已办
					理身份信息登记;
				</view>
			</view>
			<view class="card-cell">
				<image src="/static/enroll/success.png" mode=""></image>
				<view class="desc">
					取得相应准驾车型机动车驾驶证并具有3年以上
					驾驶经历;
				</view>
			</view>
			<view class="card-cell">
				<image src="/static/enroll/success.png" mode=""></image>
				<view class="desc">
					无交通肇事犯罪、危险驾驶犯罪记录，无吸毒
					记录，无饮酒后驾驶记录，最近连续3个记分周
					期内无记满12分记录;
				</view>
			</view>
			<view class="card-cell">
				<image src="/static/enroll/success.png" mode=""></image>
				<view class="desc">
					无暴力犯罪记录;
				</view>
			</view>
			<view class="card-cell">
				<image src="/static/enroll/success.png" mode=""></image>
				<view class="desc">
					自申请考试之日起前3年内无被吊销出租汽车驾
					驶员从业资格证的记录。
				</view>
			</view>
		</view>

		<view class="form">
			<view class="form-item">
				<view class="label">所在城市</view>
				<view class="zdy-input">
					<input v-model="queryForm.city" type="text" disabled />
				</view>
			</view>
			<view class="form-item" style="margin-top: 40rpx;">
				<view class="label">您的姓名</view> 
				<view class="zdy-input">
					<input v-model="queryForm.name" type="text" placeholder="请输入您的姓名" />
				</view>
			</view>
			<view class="form-item" style="margin-top: 40rpx;">
				<view class="label">手机号码</view>
				<view class="zdy-input">
					<input v-model="queryForm.phone" type="number" placeholder="请输入手机号码" />
				</view>
			</view>
			<view class="submit">
				<image src="/static/enroll/submit.png" mode="widthFix" @click="handSubmit"></image>
			</view>
		</view>
		<prize-dia ref="prize" />
	</view>
</template>

<script>
	import {
		doApplication
	} from '@/api/home.js'
	import {
		mapGetters
	} from 'vuex'
	import prizeDia from './components/prizeDia.vue'

	export default {
		components: {
			prizeDia
		},
		data() {
			return {
				loading: false,
				queryForm: {
					name: '',
					phone: this.$store.state.app.userinfo.phone,
					city: this.$store.state.app.location,
					platform: ''
				}
			}
		},
		computed: {
			...mapGetters('app', {
				token: 'token'
			})
		},
		onLoad() {
			// 判断平台
			// #ifdef MP-WEIXIN
			this.queryForm.platform = 'wx'
			// #endif
			// #ifdef MP-TOUTIAO
			this.queryForm.platform = 'dy'
			// #endif
			// #ifdef MP-KUAISHOU
			this.queryForm.platform = 'kuaishou'
			// #endif
			console.log(this.$store.state.app.userinfo.phone)
			// console.log(uni.getSystemInfoSync().platform)
		},
		methods: {
			handOpen() {

			},
			async handSubmit() {
				if (!this.token) {
					uni.navigateTo({
						url: '/pages/login/login'
					})
					return
				}
				const params = this.$u.deepClone(this.queryForm)
				if (!params.name) {
					this.$u.toast('请输入姓名')
					return
				}
				if (!params.phone) {
					this.$u.toast('请输入联系电话')
					return
				}
				if (!this.$u.test.mobile(params.phone)) {
					this.$u.toast('手机号格式不正确')
					return
				}
				if (this.loading) return
				this.loading = true
				const {
					code,
					data,
					msg
				} = await doApplication(params)
				if (code !== 200) {
					this.$u.toast(msg)
					return
				}
				await this.$store.dispatch('app/getUserInfo')
				this.queryForm = {
					name: '',
					phone: '',
					city: this.$store.state.app.location,
				}
				this.loading = false
				if (code == 200) {
					this.$u.toast(msg)
				}
			},
		}

	}
</script>

<style lang="scss" scoped>
	.enroll {
		position: relative;

		.banner {
			image {
				width: 750rpx;
				height: auto;
				display: block;
			}
		}

		.tiaojian {
			position: absolute;
			top: 510rpx;
			width: 100%;
			padding: 0 40rpx;

			.card-cell {
				padding: 20rpx 30rpx 0 42rpx;
				display: flex;

				image {
					width: 33rpx;
					height: 33rpx;
					position: relative;
					top: 3rpx;
				}

				.desc {
					flex: 1;
					margin-left: 20rpx;
					font-size: 28rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 42rpx;
				}
			}
		}

		.form {
			position: absolute;
			top: 1250rpx;
			width: 100%;
			padding: 0 70rpx;

			&-item {
				.label {
					font-size: 32rpx;
					font-family: PingFang SC-Bold, PingFang SC;
					font-weight: bold;
					color: #333333;
				}

				.zdy-input {
					height: 88rpx;
					margin-top: 24rpx;
					background: #F5F5F5;
					border-radius: 28rpx;
					padding: 0 24rpx;
					box-sizing: border-box;
					display: flex;
					align-items: center;
					input {
						flex: 1;
					}
				}
			}

			.submit {
				margin-top: 28rpx;

				image {
					width: 606rpx;
					height: auto;
				}
			}
		}
	}
</style>